<!-- 潜源区地震危险性分析-面 -->
<template>
    <el-drawer v-model="addDrawer" size="50%" :show-close="false" @opened="openDrawer" @close="closeDrawer">
        <template #title>
            <h2><svg-icon icon-class="list"></svg-icon><span style="padding-left: 15px">{{ typeName }}</span></h2>
            <el-button type="primary" @click="confirmClick" :disabled="drawerLoading" v-if="isShowSave">保存</el-button>
            <el-button type="primary" @click="closeDrawer">关闭</el-button>
        </template>
        <template #default>
            <el-form :model="form" ref="addRef" :inline="true" :rules="formRules" label-width="190px"
                v-loading="drawerLoading">
                <el-row justify="space-between">
                    <el-form-item label="省">
                        <el-input v-model="form.province" clearable disabled></el-input>
                    </el-form-item>
                    <el-form-item label="市">
                        <el-input v-model="form.city" clearable disabled></el-input>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="区/县">
                        <el-input v-model="form.county" clearable disabled></el-input>
                    </el-form-item>
                    <el-form-item label="分析单元编号" prop="id">
                        <el-input v-model="form.id" placeholder="请输入分析单元编号" clearable maxlength="17"></el-input>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="潜源名称" prop="name">
                        <el-input v-model="form.name" placeholder="请输入潜源名称" clearable maxlength="40"></el-input>
                    </el-form-item>
                    <el-form-item label="震级上限" prop="maxM">
                        <el-input v-model="form.maxM" placeholder="请输入震级上限" clearable maxlength="8"></el-input>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生5.0级地震概率" prop="f5050">
                        <el-input-number v-model="form.f5050" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生5.0级地震概率" prop="f10050">
                        <el-input-number v-model="form.f10050" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生5.5级地震概率" prop="f5055">
                        <el-input-number v-model="form.f5055" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生5.5级地震概率" prop="f10055">
                        <el-input-number v-model="form.f10055" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生6.0级地震概率" prop="f5060">
                        <el-input-number v-model="form.f5060" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生6.0级地震概率" prop="f10060">
                        <el-input-number v-model="form.f10060" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生6.5级地震概率" prop="f5065">
                        <el-input-number v-model="form.f5065" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生6.5级地震概率" prop="f10065">
                        <el-input-number v-model="form.f10065" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生7.0级地震概率" prop="f5070">
                        <el-input-number v-model="form.f5070" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生7.0级地震概率" prop="f10070">
                        <el-input-number v-model="form.f10070" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生7.5级地震概率" prop="f5075">
                        <el-input-number v-model="form.f5075" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生7.5级地震概率" prop="f10075">
                        <el-input-number v-model="form.f10075" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="50年内发生8.0级地震概率" prop="f5080">
                        <el-input-number v-model="form.f5080" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                    <el-form-item label="100年内发生8.0级地震概率" prop="f10080">
                        <el-input-number v-model="form.f10080" placeholder="范围0-1" :min="0" :max="1"></el-input-number>
                    </el-form-item>
                </el-row>
                <el-row justify="space-between">
                    <el-form-item label="备注" prop="commentInfo" style="width:100%">
                        <el-input v-model="form.commentInfo" placeholder="请输入备注" :autosize="{ minRows: 6, maxRows: 12 }"
                            type="textarea" show-word-limit maxlength="2147483647" clearable></el-input>
                    </el-form-item>
                </el-row>
            </el-form>
        </template>
    </el-drawer>
</template>
<script setup>
// 引入基础方法
import useSpatialData from '@/hooks/useSpatialData';
// 引入表单验证规则
import { eightDouble, fourInt } from '@/utils/validate';
// 获取数据字典值
import { getDict } from '@/api/system/dict'
const { route, addDrawer, drawerLoading, form, typeName, openDrawer, closeDrawer, confirmClick, isShowSave } = useSpatialData();
// 表单验证规则
const formRules = {
    id: [{ required: true, message: '请输入分析单元编号！', trigger: 'blur' }],
    // name: [{ required: true, message: '请输入潜源名称', trigger: 'blur' }],
    maxM: [eightDouble],
    f5050: [eightDouble],
    f10050: [eightDouble],
    f5055: [eightDouble],
    f10055: [eightDouble],
    f5060: [eightDouble],
    f10060: [eightDouble],
    f5065: [eightDouble],
    f10065: [eightDouble],
    f5070: [eightDouble],
    f10070: [eightDouble],
    f5075: [eightDouble],
    f10075: [eightDouble],
    f5080: [eightDouble],
    f10080: [eightDouble],
}
</script>
<style lang="scss" scoped>
.el-input-number {
    width: 210px;
}
</style>